

<template>
  <div class="task-list-wrap">
    <dv-scroll-board  :config="config" style="width:100%;height:100%" />
    <div v-if="!config.data.length" class="baojing-wrap" style="display:flex;height: 100%;align-items: center;justify-content: center;flex-direction: column">
      <img style="width: 40px;height: 40px" :src="noData" />
      <div style="text-align: center;font-size: 12px">暂无数据</div>
    </div>
  </div>
</template>
<script setup lang="ts">
import {carListData} from "@/views/vms-bi/testData"
import {biApi} from "@/views/vms-bi/biApi.js"
import {onMounted, ref} from "vue";
import { useInterval } from 'vue-hooks-plus'
import noData from "@/views/vms-bi/asset/img/noData.png";
const config =ref({
  header: ['车牌', '出车时间', '目的地'],
  data: [
  ],
  index: false,
  columnWidth: [50],
  align: ['left','left','left'],
  carousel: 'single',
  headerBGC:"#0f375f",
  hoverPause:true,
  oddRowBGC:"rgba(10,130,245,0.8)",
  evenRowBGC:"",
  waitTime:5000
})

/*
* 获取数据
* */

const getData = ()=>{
  biApi.getInformation().then((data:any)=>{
    let rebuildData = []
    data && data.forEach((item:any)=>{
      rebuildData.push([
          item.car_number,
        `<span title=${item.reality_begin_time}">${item.reality_begin_time}</span>`,
          `<span  title=${item.destination[0]}>${item.destination[0]}</span>`

      ])
    })
    config.value = {
      header: ['车牌', '出车时间', '目的地'],
      data: rebuildData,
      index: true,
      columnWidth: [60,100,160],
      align: ['left','left','left'],
      carousel: 'single',
      headerBGC:"#0f375f",
      hoverPause:true,
      oddRowBGC:"rgba(14,52,86,0.8)",
      evenRowBGC:"",
      waitTime:5000
    }
  })
}
const { clear, restart } = useInterval(() => {
  getData()
}, 1000 * 60,{
  immediate:true
})
onMounted(()=>{

  // getData()
})



</script>
<style scoped lang="scss">
.task-list-wrap{
  height: 100%;
  width:100%;
  position: relative;
  .baojing-wrap{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
  }
}
</style>